<template>
	<view class="error_code">

		<view class="lists" v-for="(item,index) in list">
			<view class="list">
				<view class="fa">
					<image class="icon" src="../../../static/home/lef.png" mode=""></image>
					<view>
						{{item.create_time}}
					</view>
				</view>
			
				<view class="times">
					
					<text v-if="lang==0">
						故障类型
					</text>
					<text v-if="lang==1">
						Fault Type
					</text>
					：
					 <span v-if="lang==1">{{item.en_type&&item.en_type!=null?item.en_type:item.type}}</span>
					 <span v-if="lang==0">{{item.type}}</span>
				</view>
				<view class="times1">
					
					<text v-if="lang==0">
						故障代码
					</text>
					<text v-if="lang==1">
						error_code
					</text>
					：{{item.error_code_hex}}
				</view>
				<view class="del_r" @click="del(item.id)">
				
					<text v-if="lang==0">
						删除
					</text>
					<text v-if="lang==1">
						delete
					</text>
				</view>
			</view>
		</view>


	<view style="width: 100%;height: 100px;background-color: #111823;;;">
		
	</view>
	</view>
</template>

<script>
	import Tabbar from '@/components/tabbar/tabbar.vue'
	import uniPopup from "@/components/uni-popup/uni-popup.vue";
	export default {
		components: {
			'view-tabbar': Tabbar,
			uniPopup
		},
		data() {
			return {

				list: [], //我的报名
				total: 0, //总条数
				page: 1, //当前页数
				nodata: false, //是否有数据
				lang:0
			};
		},
		onLoad() {
			this.getList();
		},
		onReachBottom() {
			console.log(777777777777)
			
				this.page++;
				this.getList();
		
		},
		onShow() {
			let _this = this;
			if(uni.getStorageSync('lang')){
				this.lang =  uni.getStorageSync('lang');
			}
			
			if(this.lang == 1){
				uni.setNavigationBarTitle({
						 title: 'Fault record'
				})
			}else{
				uni.setNavigationBarTitle({
					   title: '故障记录'
				})
			}
		},
		methods: {
			del(id){
				let _this = this;
				let that = this;
		
						
						if(_this.lang == 1){
							uni.showModal({
							    title: 'Are you sure to delete',
							    // content: '您的位置信息将用获取信息',
								cancelText: "cancel", // 取消按钮的文字
								confirmText: "ok", // 确认按钮的文字  
							    success: (res) => {
							        if (res.confirm) {
							           that.$api.request('/api/user/error_del', {id:id}, that.$store.state.token, function(res){
							           	if(res.code == 1) {
							           		
							           		that.page = 1;
							           		that.list = [];
							           		that.total = 0;
							           		that.getList();
							           	}
							           });
							        }
							    }
							})
						}else{
							uni.showModal({
							    title: '是否确认删除',
							    // content: '您的位置信息将用获取信息',
							    success: (res) => {
							        if (res.confirm) {
							           that.$api.request('/api/user/error_del', {id:id}, that.$store.state.token, function(res){
							           	if(res.code == 1) {
							           		
							           		that.page = 1;
							           		that.list = [];
							           		that.total = 0;
							           		that.getList();
							           	}
							           });
							        }
							    }
							})
						}
					
			},
			getList() {
				let _this = this;
				this.$api.request('/api/user/error_list', {
					page: this.page
				}, this.$store.state.token, function(res) {
					if (res.code == 1) {
						if (_this.page == 1) {
							_this.list = res.data.data;
						} else {
							_this.list = _this.list.concat(res.data.data);
						}
						_this.total = res.data.total_item_count;
						if (_this.list.length > 0) {
							_this.nodata = false;
						} else {
							_this.nodata = true;
						}
					}
				});
			}
		}
	}
</script>


<style lang="scss" scoped>
	page{
		background: #111823;
	}
	.error_code {
		background: #111823;
		min-height: 100vh;
		float: left;
		width: 100%;
		.del_r{
			z-index: 9999;
			// float: right;
			margin-right: 60rpx;
			position: absolute;
			right: 0rpx;
			// top:-600rpx;
			color: red;
		}
		.lists {
			margin-top: 10px;
			;
			width: 100%;
			background: #293241;
			height: 200rpx;
			line-height: 60px;
			box-shadow: 0 0 10rpx 0 rgba(118, 156, 255, 0.3);
			float: left;

			.list {
				width: 100%;
				;
				color: #7A818E;
				float: left;
				font-size: 28rpx;

				.red {
					font-size: 36rpx;
					margin-right: 5rpx;
					color: red;
				}

				&:last-child {
					border-bottom: none;
				}

				.fa {
					font-weight: 500;
					margin-left: 25rpx;
					float: left;
					color: #fff;
				}

				.icon {
					margin-right: 16rpx;
					width: 38rpx;
					height: 38rpx;
					float: left;
				}

				.rightimg_str {
					color: #fff;
					float: right;
					margin-right: 20px
				}

				.times {
					width: 100%;
					float: left;
					position: relative;
					top: -75rpx;
					left: 75rpx;
					color: #fff;
					span{
						padding: 4rpx 10rpx 4rpx 10rpx;
						background: #df202f;
						border-radius: 5em;
					}
				}
				.times1 {
					width: 100%;
					float: left;
					position: relative;
					top: -155rpx;
					left: 75rpx;
					color: #fff;
				}
			}
		}


	}
</style>